
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>计算器的实现</title>
	</head>
	<script type="text/javascript">
		function calCulate(val){
			
			var num = document.getElementById("t");
			switch(val){
				case "=":
				num.value = eval(num.value);
				
				break;
				
				case "C":
				num.value = "";
				break;
				
				default:
				  num.value =num.value+val;
				break;
			}
			
			
		}
		
		
		
	</script>
	
	<style type="text/css">
		#sDiv{
			text-align: center;
			border: solid 1px;
			width: 300px;
			border-radius: 10px;
			background-color: aqua;
		}
		#t{
			border:solid 1px ;
			width: 260px;
			border-radius: 10px;
			margin-top: 10px;
			margin-bottom: 10px;
			font-size: 20px;
		}
		input[type=button]{
			border-radius: 5px;
			width: 55px;
			height: 30px;
			margin: 2px;
			font-size: 20px;
		}
		#equ{
			width: 260px;
			font - size: 30px;
			margin-bottom: 10px;
		}
	</style>
	
	<body>
		<div id="sDiv">
 
		<input type="text" name="t" id="t" value="" /><br/>
		<input type="button" name="" id="" value="1" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="2" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="3" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="4" onclick="calCulate(this.value)"/><br />
		<input type="button" name="" id="" value="5" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="6" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="7" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="8" onclick="calCulate(this.value)"/><br />
		<input type="button" name="" id="" value="9" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="0" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="." onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="C" onclick="calCulate(this.value)"/><br/>
		<input type="button" name="" id="" value="+" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="-" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="*" onclick="calCulate(this.value)"/>
		<input type="button" name="" id="" value="/" onclick="calCulate(this.value)"/><br/>
		<input type="button" name="" id="equ" value="=" onclick="calCulate(this.value)"/>
		</div>
	</body>
</html>
